<template>
  <div class="home">
    <!--<div style="height: 400px;"></div>-->
    <!--<breadcrumb></breadcrumb>-->
    <!--<carousel></carousel>-->
    <!--<search-input @search="doSearch" :aboutList="aboutList"></search-input>-->
    <!--<div style="height: 30px;"></div>-->
    <!--<pagination @pageChange="pageChange" :total="total" :current="current"></pagination>-->
    <!--<a-button @click="changeTotal"></a-button>-->
    <!--<mainAnchor :anchorList="anchorList"></mainAnchor>-->
    <!--<div class="main-list">-->
      <!--<div class="each-line" v-for="(item, index) in showList" :key="item.name" :id="'main-anchor-' + index">-->
        <!--<div>{{item.name}}</div>-->
      <!--</div>-->
    <!--</div>-->

  </div>
</template>

<script>
// import breadcrumb from '@/components/common/breadcrumb.vue'
// import carousel from '@/components/common/carousel.vue'
// import searchInput from '@/components/common/searchInput.vue'
// import pagination from '@/components/common/pagination.vue'
import mainAnchor from '@/components/specific/mainAnchor.vue'

export default {
  name: 'Home',
  components: {
    // breadcrumb,
    // carousel,
    // searchInput,
    // pagination
    mainAnchor
  },
  data() {
    return {
      aboutList: [
        {
          name: '这是不存在的'
        }
      ],
      total: 1,
      current: 1,
      anchorList: [],
      showList: [
        {
          name: '油品'
        },
        {
          name: '轮胎'
        },
        {
          name: '蓄电池'
        },
        {
          name: '制动系统'
        },
        {
          name: '点火系统'
        },
        {
          name: '化学养护'
        },
        {
          name: '精品'
        }
      ]
    }
  },
  mounted() {
    this.anchorList = [];
    for(let i = 0; i < this.showList.length; i ++) {
      this.anchorList.push({
        link: '#main-anchor-' + i,
        name: this.showList[i].name
      })
    }
  },
  methods: {
    doSearch(val) {
      console.log(val);
    },
    pageChange(current) {
      console.log(current);
      this.current = current;
    },
    changeTotal() {
      this.total = this.total + 10;
      this.$message.success('提示');
      // this.$router.push('/login');
    }
  }
}
</script>

<style lang="less" scoped>
  .each-line {
    height: 400px;
  }
</style>
